<!--
 * @Author: 刘苗
 * @Description: 表单配置
 * @Date: 2021-08-26 13:52:49
-->
<template>
  <div style="padding: 25px; background: #fff">
    <base-form
      :inline="!false"
      size="small"
      :fromIems="fromIems"
      :labelWidth="'150px'"
    ></base-form>
  </div>
</template>


<script>
export default {
  data() {
    return {
      fromIems: [
        {
          label: "普通输入框",
          valueType: "input",
          dataIndex: "name", //字段名
          rules: [
            { required: true, message: "请填写活动形式", trigger: "change" },
          ],
          props: {
            style: {
              width: "220px",
            },
          },
        },
        {
          label: "下拉框",
          valueType: "select",
          dataIndex: "type",
          rules: [{ required: true, message: "请填写类型", trigger: "change" }],
          options: [
            {
              label: "类型一",
              value: 1,
            },
            {
              label: "类型二",
              value: 2,
            },
          ],
          props: {
            style: {
              width: "220px",
            },
            clearable: true,
            filterable: true,
          },
        },
        {
          label: "下拉框-联动",
          valueType: "select",
          dataIndex: "type2",
          options: [
            {
              label: "显示类型",
              value: 1,
            },
            {
              label: "不显示类型",
              value: 2,
            },
          ],
          onChange: (e) => {
            console.log(e);
          },
        },
        {
          label: "类型",
          valueType: "select",
          dataIndex: "test",
          options: [],
          hide: (formModel) => {
            return formModel.type2 === 1;
          },
        },
        {
          label: "数字",
          valueType: "inputNumber",
          dataIndex: "inputNumber",
        },
        {
          label: "开关",
          valueType: "switch",
          dataIndex: "switch",
        },
        {
          label: "日期选择",
          valueType: "datePicker",
          dataIndex: "datePicker",
        },
        {
          label: "日期选择-时间",
          valueType: "datePicker",
          dataIndex: "time",
          props: {
            type: "datetime",
          },
        },
        {
          label: "日期选择-范围",
          valueType: "datePicker",
          dataIndex: "datetimerange",
          props: {
            type: "datetimerange",
          },
        },
        {
          label: "单选",
          valueType: "radio",
          dataIndex: "radio",
          defaultVal: 1,
          options: [
            {
              label: "单选一",
              value: 1,
            },
            {
              label: "单选二",
              value: 2,
            },
          ],
        },
      ],
    };
  },
  mounted() {
    // this.initData();
  },
  methods: {
    initData() {
      this.$getTypeList().then((res) => {
        this.fromIems[2].options = res.content.map((el) => {
          return {
            label: el.name,
            value: el.code,
          };
        });
      });
    },
  },
  // computed: {
  //   fromIems(){
  //     return [

  //     ]
  //   }
  // },
};
</script>